import 'package:flutter/material.dart';

// ignore: must_be_immutable
class NavigationTabDemo extends StatelessWidget {
  var _choices = <_Choice>[
    _Choice('自驾', Icons.directions_car),
    _Choice('公交车', Icons.directions_bus),
    _Choice('地铁', Icons.directions_railway),
    _Choice('自行车', Icons.directions_bike),
    _Choice('步行', Icons.directions_walk)
  ];

  @override
  Widget build(BuildContext context) => DefaultTabController(
        length: _choices.length,
        child: Scaffold(
          appBar: AppBar(
            centerTitle: true,
            title: Text('BottomNavigationTabBar示例'),
          ),
          body: TabBarView(
            children: _choices
                .map(
                  (_Choice choice) => Padding(
                    padding: EdgeInsets.all(16.0),
                    child: Center(
                      child: Column(
                        mainAxisSize: MainAxisSize.min,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          Icon(
                            choice.icon,
                            size: 128.0,
                            color: Theme.of(context).textTheme.headline4.color,
                          ),
                          Text(
                            choice.title,
                            style: Theme.of(context).textTheme.headline4,
                          )
                        ],
                      ),
                    ),
                  ),
                )
                .toList(),
          ),
          bottomNavigationBar: Material(
            color: Theme.of(context).cardColor,
            child: TabBar(
              labelColor: Theme.of(context).accentColor,
              unselectedLabelColor: Colors.grey[500],
              indicatorWeight: 0.1,
              tabs: _choices
                  .map((_Choice choice) => Tab(
                        // text: choice.title,
                        // icon: Icon(choice.icon),
                        // iconMargin: EdgeInsets.only(bottom: 5.0),
                        // 以上属性和 child 互斥
                        child: Icon(choice.icon),
                      ))
                  .toList(),
            ),
          ),
        ),
      );
}

class _Choice {
  const _Choice(this.title, this.icon);

  final String title;
  final IconData icon;
}
